<!DOCTYPE html>
<html lang="en">

<head>
	
	<meta charset="utf-8" />
	<!-- <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.0/css/bootstrap-grid.css" rel="stylesheet"> -->
	<link href="../vendor/bootstrap-grid.css" rel="stylesheet">
	<link rel="apple-touch-icon" sizes="76x76" href="../assets/img/favicon.ico">
	<link rel="icon" type="image/png" href="../assets/img/favicon.ico">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no'
		name='viewport' />

	<!-- Google Font -->


	<!-- Font Awesome Icons -->

	<!-- Main CSS -->
	<link href="../assets/css/main.css" rel="stylesheet" />

	<!-- Animation CSS -->
	<link href="../vendor/aos.css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="../assets/font/iconfont.css" />
	<style>
		.layui-unselect dl {
			display: none;
		}

		.tree {
			padding-top: 10px;
			border: 1px solid #ced4da;
			display: block;
			margin: auto;
			position: relative;
			padding-left: 20px;
		}

		a {
			text-decoration: none;
			color: #434b5a;
		}

		.synTree .iconxiangyou {
			cursor: pointer;
		}

		.synTree span {
			position: relative;
			top: -6px;
			left: 10px;
			color: #010102;
			cursor: default;
		}

		.leg_tree li {
			list-style-type: none;
			margin-left: -10px;
			position: relative;
			line-height: 22px;
		}

		.leg_tree li a {
			position: absolute;
			top: -4px;
			padding: 0px 10px;
		}

		.iconxiangyou {
			position: absolute;
			top: -5px;
			left: -10px;
		}

		.leg_tree li i {
			font-size: 14px;
		}

		.leg_tree li i~i:before {
			position: relative;
			top: -3px;
			left: 5px;
		}

		.tree input {
			cursor: pointer;
		}

		.tree span {
			font-size: 13px;
			cursor: pointer;
			display: inline-block;
			border: 1px solid #e2e2e2;
			width: 10px;
			line-height: 8px;
			text-align: center;
			height: 10px;
			background-color: whitesmoke;
			position: absolute;
			left: 8px;
			top: 4px;
		}

		.tree ul span {
			left: -16px;
		}

		.tree ul {
			list-style-type: none;
			margin-top: 0px;
			position: relative;
		}

		.label {
			width: 14px;
			height: 14px;
			display: inline-flex;
			border: 1px solid #a5a5a5;
			border-radius: 3px;
		}

		.label i {
			color: #0095ff;
			position: absolute;
			top: -2px;
			left: -1px;
			font-size: 18px !important;
		}

		.label:hover {
			box-shadow: 0 0 4px 0px #a0aefb;
		}

		/*.label i:hover {
			box-shadow: 0 0 4px 0px #a0aefb;
		}*/
		.isShow {
			position: absolute;
			top: -3px;
			left: -20px;
		}

		input {
			display: none;
		}

		.isShow {
			width: 14px;
			margin-right: 5px;
		}
	</style>
</head>

<body>


	<main class="container">

		<!--------------------------------------
PRICING
--------------------------------------->
		<section class="pt-4 pb-5">
			<div class="col-md-12">
				<form class="layui-form" lay-filter="applyTryForm">
					<div class="row form-group">
						<div class="col notRequest">
							<label><span style="color: red;">*</span>申请用户</label>
							<input type="text" class="form-control"
								   name="createBy">
						</div>
						<div class="col disabledNone request" >
							<label><span style="color: red;">*</span>联系人</label>
							<input type="text" class="form-control" lay-verify="required"
								   name="requestUserName">
						</div>
						<div class="col">
							<div class="col ">
								<label><span style="color: red;">*</span>联系方式</label>
								<input type="number" class="form-control" placeholder="请填写联系方式"
									   lay-verify="required|phone|number" name="phone" required="">
							</div>
					</div>
					</div>
					<div class="row form-group notRequest">
						<div class="col">
							<label><span style="color: red;">*</span>产品名称</label>
							<input type="text" class="form-control" placeholder=""
								   name="productName" required="">
						</div>
						<div class="col notRequest">
							<label><span style="color: red;">*</span>产品所属用户</label>
							<input type="text" class="form-control"  placeholder=""
								   name="requestUserName" required="">
						</div>
					</div>
<!--					<div class="row form-group ">-->
<!--						<div class="col">-->
<!--							<label><span style="color: red;">*</span>产品数量</label>-->
<!--							<input type="number" class="form-control" lay-verify="required|number" placeholder="请填写产品数量"-->
<!--								   name="number">-->
<!--						</div>-->
<!--						<div class="col ">-->
<!--							<label><span style="color: red;">*</span>计价方式</label>-->
<!--							<select name="unit" lay-verify="required" class="form-control select">-->
<!--								<option value="0">按次</option>-->
<!--								<option value="1">按条</option>-->
<!--								<option value="2">按kb</option>-->
<!--								<option value="3">按天</option>-->
<!--							</select>-->
<!--						</div>-->

<!--					</div>-->
					<div class="row form-group ">
						<div class="col">
							<label><span style="color: red;">*</span>申请理由</label>
							<textarea class="form-control" name="reason" rows="3" placeholder="请填写申请理由"></textarea>
						</div>
					</div>
					<div class="row form-group disabledNone auditInfo">
						<div class="col form-group">
							<p class="form-group">审核意见：</p>
							<textarea class="form-control" name="auditInfo" rows="3" placeholder="请填写审核意见"></textarea>
						</div>
					</div>
					<button class="btn btn-cyan btn-round text-white submit-btn disabledNone pass" lay-filter="pass" lay-submit
						style="float: right;">提交</button>
					<button class="btn btn-cyan btn-round text-white submit-btn disabledNone overrule" lay-filter="overrule" lay-submit
							style="float: right;">驳回</button>
				</form>
			</div>
		</section>


</main>
		<!--------------------------------------
JAVASCRIPTS
--------------------------------------->
		<script src="../vendor/jquery.min.js" type="text/javascript"></script>
		<script src="../vendor/popper.min.js" type="text/javascript"></script>
		<script src="../vendor/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
		<script src="../assets/layui/layui.js" type="text/javascript"></script>
		<script src="../js/tool.js" type="text/javascript"></script>



		<script>
			/**
			 * @file applyTryPop.html
			 * @Date 2023-11-28, 周二, 11:24
			 * @description 文件说明
			 *申请试用、试用审核、试用详情弹窗
			 */

			$(function () {
				function getUrlParam(name) {
					var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
					var r = window.location.search.substr(1).match(reg);  //匹配目标参数
					if (r != null) return unescape(r[2]); return null; //返回参数值
				}
				let index = parent.layer.getFrameIndex(window.name);
				const queryString = window.location.search;
				const urlParams = new URLSearchParams(queryString);
				// 获取associateId参数的值 试用申请信息的id
				const associateId =Number(urlParams.get('associateId'))
				const type =Number(urlParams.get('type'))
				const id =Number(urlParams.get('id'))//审核的id
				if(associateId&&type){
					$(".layui-form").find("input").attr("disabled",true);
					$(".layui-form").find("select").attr("disabled",true);
					$(".layui-form").find("textarea").attr("disabled",true);
					$(".layui-form .notRequest").removeClass("disabledNone");
					$(".layui-form .request").addClass("disabledNone");
					if (type===1){//详情
						$(".layui-form .submit-btn").addClass("disabledNone");
					}else {//审核
						$('.auditInfo').removeClass("disabledNone")
						$('textarea[name=auditInfo]').attr("disabled", false);
						$(".layui-form .submit-btn").removeClass("disabledNone");
					}
					$.ajax({
      					 timeout:30000,
					    url: window.Http + "/tryInfo/"+associateId,
					    type: 'GET',
					    headers: {
					        'Authorization': "Bearer " + sessionStorage.getItem('Token')
					    },
					    success: function (res) {
					        if (res.code === 200) {
								layui.form.val("applyTryForm",res.data);
					        }else {
								layer.msg('获取使用申请信息失败')
							}
					    }
					})
				}else{//试用申请
					$(".layui-form").find("input").attr("disabled",false);
					$(".layui-form").find("select").attr("disabled",false);
					$(".layui-form").find("textarea").attr("disabled",false);
					$(".layui-form .pass").removeClass("disabledNone");
					$(".layui-form .notRequest").addClass("disabledNone");
					$(".layui-form .request").removeClass("disabledNone");
				}


				//提交
				layui.use(['form'], function () {
					var form = layui.form;
					//自定义验证规则
					form.verify({
						// title: function (value, item) {
						// 	if (value.length < 5) {
						// 		return '标题至少得5个字符';
						// 	}
						// }, fname: function (value) {
						// 	if (value.length < 4) {
						// 		return '请输入至少4位的用户名';
						// 	}
						// }, contact: function (value) {
						// 	if (value.length < 4) {
						// 		return '内容请输入至少4个字符';
						// 	}
						// }
						phone: [/^1\d{10}$/, '手机必须11位，只能是数字！']
						, email: [/^[a-z0-9._%-]+@([a-z0-9-]+\.)+[a-z]{2,4}$|^1[3|4|5|7|8]\d{9}$/, '邮箱格式不对']
					});
					//监听提交
					form.on('submit(pass)', function (data) {
						console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value};获取单个值data.field["title"]
						let formData = layui.form.val("applyTryForm");
						if (parent.window.productId){//试用申请
							formData.productId = parent.window.productId;//如果是申请使用就是存在widow里面的
							$.ajax({
								timeout:30000,
								url: window.Http + "/tryInfo",
								type: 'POST',
								headers: {
									'Authorization': "Bearer " + sessionStorage.getItem('Token')
								},
								data: JSON.stringify(formData),
								contentType: "application/json",
								success: function (res) {
									if (res.code === 200) {
										layer.msg("申请成功，请等待审核！");
										setTimeout(function () {
											let index = parent.layer.getFrameIndex(window.name);
											//再执行关闭
											parent.layer.close(index);
											// parent.layer.close(1); //再执行关闭
										}, 1000)
									} else {
										layer.msg(res.msg);
									}
								}
							})
						}else {
							auditReq(id,2)//通过
						}


						return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
					});
					form.on('submit(overrule)',function (data) {
						console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value};获取单个值data.field["title"]
						let formData = layui.form.val("applyTryForm");
						if (id){
							const auditInfo=form.val('applyTryForm').auditInfo
							auditReq(id,3,auditInfo)//驳回
						}else {
							layer.msg('获取审核id失败')
						}
					})
				});
				function auditReq(id,status,auditResult='') {
					$.ajax({
						timeout:30000,
						url: window.Http + "/audit/log/operate",
						type: 'POST',
						headers: {
							'Authorization': "Bearer " + sessionStorage.getItem('Token')
						},
						contentType: 'Application/json',
						data:JSON.stringify({
							id,
							status,
							auditResult
						}),
						success: function (res) {
							if (res.code === 200) {
								layer.msg('审核成功')
								setTimeout(function () {
									parent.layer.close(index);
								},1000)
							}else {
								layer.msg(res.msg)
							}
						}
					})
				}

			})
		</script>

</body>

</html>
